<template>
  <div class='capital' style='height: 100%;'>
    <div class='top'>
      <div class='left'>
        <div class="block">
          <span class="demonstration" style='color: #30383e;font-size: 14px;'>时间范围：</span>
         <el-date-picker v-model="ptime" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期" range-separator="至"></el-date-picker>

        </div>
        <!-- <span></span>
        <div class="block">
          <el-date-picker v-model="value2" type="date" placeholder="选择日期">
          </el-date-picker>
        </div> -->
        <div class='left_last' style='marginLeft: 50px;'>
          <span>当前状态：</span>
          <v-numodule ref='status' :list='["建仓直推","建仓间推","建仓团队奖","","","复投团队奖","平台分红","用户提现","用户复投"]'></v-numodule>
          <button @click='getList'>查询</button>
          <button @click='clear'>重置</button>
        </div>
      </div>

    </div>
    <div class='capital_table'>
      <div class='moddle'>
        <v-table :list='list' :tableData='tableData'></v-table>
      </div>
    </div>
    <div class='bottom'>
      <div class="block">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage4" :page-size="pageSize" prev-text="上一页" next-text="下一页" layout="prev, pager, next, jumper, total" :total="total">
        </el-pagination>
      </div>
    </div>
  </div>

</template>
<script>
import table from "../common/table.vue";
import numoudle from "../common/numodule.vue";
import $ from 'jquery'
export default {
  components: {
    "v-table": table,
    "v-numodule": numoudle
  },
   watch: {
    ptime: function(newTime) {
      if (!newTime) return;
      this.value1 = t.gshDate(newTime[0]);
      this.value2 = t.gshDate(newTime[1]);
    },
  },
  created() {
    this.$parent.flag = true;
  },
  mounted() {
    this.getList();
   
  },
  methods: {
    handleSizeChange(val) {
    },
    handleCurrentChange(val) {
      this.page = parseInt(val);
      this.getList();
    },
    getList() {
      this.$refs.status.value
        ? (this.type = this.val.indexOf(this.$refs.status.value))
        : "";
      u.zjdetails(
        {
          page: parseInt(this.page),
          pageSize: this.pageSize,
          endTime: this.value2,
          startTime: this.value1,
          type: this.type
        },
        data => {
          if (data && data.code == "200" && data.data && data.data.list) {
            this.tableData = [];
            this.total = data.data.total;
            data.data.list.forEach((item, index) => {
              var obj = {};
              obj.tda = item.typeString;
              obj.tdb = item.total;
              obj.tdc = item.subTotalNum;
              obj.tdd = item.subNum;
              obj.tde = item.subReCast;
              obj.tdf = item.remainBalance;
              obj.tdj = item.remainCastBalance;
//              obj.tdg = item.;
              obj.tdh = item.description;
              obj.date = item.createTime;
              this.tableData.push(obj);
            });
          }
        }
      );
    },
    clear() {
      this.$refs.status.value = "";
      this.type = null;
      this.value1 = null;
      this.value2 = null;
      this.getList();
    }
  },
  data() {
    return {
      val: [
        "建仓直推",
        "建仓间推",
        "建仓团队奖",
        "",
        "",
        "复投团队奖",
        "平台分红",
        "用户提现",
        "用户复投"
      ],
      ptime:'',
      type: null,
      page: 1,
      pageSize: 10,
      total: 0,
      endTime: null,
      startTime: null,
      currentPage1: 5,
      currentPage2: 5,
      currentPage3: 5,
      currentPage4: 4,
      pickerOptions2: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      value1: "",
      value2: "",
      tableData: [],
      list: [
        { key: "tda", title: "类型" },
        { key: "tdb", title: "金额" },
        { key: "tdc", title: "分佣总金额" },
        { key: "tdd", title: "分佣余额" },
        { key: "tde", title: "分佣复投额" },
        { key: "tdg", title: "BPX数量" },
        { key: "tdf", title: "剩余余额" },
        { key: "tdj", title: "剩余复投余额" },
        { key: "tdh", title: "描述" },
        { key: "date", title: "创建时间" }
      ]
    };
  }
};
</script>
<style lang='less' scoped>
@import "../../../static/common/capital.less";
</style>
<style>
.el-date-editor .el-range-input {
    width: 60% !important;
  }
.el-date-editor .el-range-separator {
    padding: 0!important;
  }
</style>
